//----------------------------------------------
// Forms
//---------------------------------------------- 
form {
  display: flex;
  justify-content: center;
  width: 100%;
}

//----------------------------------------------
// Inputs
//---------------------------------------------- 
input,
textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0.75em 0.5em;

  font-family: $font;
  font-size: $font-small;
  font-weight: 400;
  color: $color-black;
  background: transparent;
  border: 2px solid rgba($color-black, 0.6);
  border-radius: 0;
  box-shadow: none;
  outline: 0;
  -webkit-appearance: none;
  transition: border-color 200ms ease-in-out;

  &:hover,
  &:focus {
    border-color: $color-black;
  }

  .footer & {
    color: $color-white;
    border: 2px solid rgba($color-white, 0.6);

    &:hover,
    &:focus {
      border-color: $color-white;
    }
  }
}

textarea {
  resize: none;
}

input[type="submit"] {
  position: relative;
  z-index: $z-1;

  font-weight: 700;
  cursor: pointer;
}

//----------------------------------------------
// Labels
//---------------------------------------------- 
label {
  @extend %font-header;

  display: block;

  font-size: $font-small;
}

//----------------------------------------------
// Misc
//---------------------------------------------- 
.form-group {
  width: 45%;
  margin-right: 0.5em;
}

//----------------------------------------------
// Placeholders
//---------------------------------------------- 
::placeholder {
  color: $color-grey;
}
